<!DOCTYPE html>
<html>
{% load static %}
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
    <title>mtianyan慕课小站注册</title>
    <link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'css/login.css' %}">

</head>
<body>
<div class="loginbox dialogbox">
    <h1>账号登录</h1>
    <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
    <div class="cont">
        <form id="jsLoginForm" autocomplete="off">
            <div class="box">
                <span class="word3">用户名</span>
                <input type="text" name="account_l" id="account_l" placeholder="手机号/邮箱" />
            </div>
            <div class="box">
                <span class="word2">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码</span>
                <input type="password" name="password_l" id="password_l" placeholder="请输入您的密码"/>
            </div>
            <div class="error btns login-form-tips" id="jsLoginTips"></div> <!--登录错误提示-->
            <div class="btns">
                <span><input type="checkbox" id="jsAutoLogin" />&nbsp;自动登录</span>
                <span class="forget btn fr">忘记密码</span>
            </div>
            <div class="button">
                <input type="button" value="登录" id="jsLoginBtn" />
            </div>
            <div class="btns">
                <span class="fr">没有账号？<span class="regist btn">立即注册</span></span>
            </div>
        </form>
    </div>
</div>
<div class="dialog" id="jsDialog">
    <!--提示弹出框-->
    <div class="successbox dialogbox" id="jsSuccessTips">
        <h1>成功提交</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="cont">
            <h2>您的需求提交成功！</h2>
            <p></p>
        </div>
    </div>
    <div  class="noactivebox dialogbox" id="jsUnactiveForm" >
        <h1>邮件验证提示</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="center">
            <img src="{% static 'images/send.png' %}"/>
            <p>我们已经向您的邮箱<span class="green" id="jsEmailToActive">12@13.com</span>发送了邮件，<br/>为保证您的账号安全，请及时验证邮箱</p>
            <p class="a"><a class="btn" id="jsGoToEmail" target="_blank" href="http://mail.qq.com">去邮箱验证</a></p>
            <p class="zy_success upmove"></p>
            <p style="display: none;" class="sendE2">没收到，您可以查看您的垃圾邮件和被过滤邮件，也可以再次发送验证邮件（<span class="c5c">60s</span>）</p>
            <p class="sendE">没收到，您可以查看您的垃圾邮件和被过滤邮件，<br/>也可以<span class="c5c green" id="jsSenEmailAgin" style="cursor: pointer;">再次发送验证邮件</span></p>
        </div>
    </div>
</div>

<div class="bg" id="dialogBg"></div>
<header>
    <div class="c-box fff-box">
        <div class="wp header-box">
            <p class="fl hd-tips">mtianyan慕课小站，在线学习平台！</p>
            <ul class="fr hd-bar">
                <li>服务电话：<span>2333333333</span></li>
                <li><a href="{% url 'login' %}">[登录]</a></li>
                <li class="active"><a href="{% url 'register' %}">[注册]</a></li>
            </ul>
        </div>
    </div>
</header>
<section>
    <div class="c-box bg-box">
        <div class="login-box clearfix">
            <div class="hd-login clearfix">
                <a class="index-logo" href="{% url 'index' %}"></a>
                <h1>用户注册</h1>
                <a class="index-font" href="{% url 'index' %}">回到首页</a>
            </div>
            <div class="fl slide">
                <div class="imgslide">
                    <ul class="imgs">

                        <li><a href=""><img width="483" height="472" src="http://myphoto.mtianyan.cn/blog/180111/BF6d8jeg5K.png?imageslim" /></a></li>

                        <li><a href=""><img width="483" height="472" src="{% static 'images/register2.png' %}" /></a></li>

                        <li><a href=""><img width="483" height="472" src="{% static 'images/register1.png' %}" /></a></li>

                    </ul>
                </div>
                <div class="unslider-arrow prev"></div>
                <div class="unslider-arrow next"></div>
            </div>
            <div class="fl form-box">
                <div class="tab">
                    <!--<h2 class="active">手机注册</h2>-->
                    <h2>邮箱注册</h2>
                </div>
<!-- <div class="tab-form"> -->
                    <!--<form id="mobile_register_form" autocomplete="off">-->
                        <!--<div class="form-group marb20">-->
                            <!--<label>手&nbsp;机&nbsp;号</label>-->
                            <!--<input id="jsRegMobile" name="account" type="text" placeholder="请输入您的手机号码" />-->
                        <!--</div>-->
                    <!--<div class="form-group marb20" id="jsRefreshCode">
                            <label>验&nbsp;证&nbsp;码</label>
                           <input autocomplete="off" class="form-control-captcha mobile-register-captcha" id="mobile-register-captcha_1" name="captcha_m_1" placeholder="请输入验证码" type="text" /> <input class="form-control-captcha mobile-register-captcha" id="mobile-register-captcha_0" name="captcha_m_0" placeholder="请输入验证码" type="hidden" value="29953bacf7005e8469388b449d97d00d523c1706" /> &nbsp;<img src="/captcha/image/29953bacf7005e8469388b449d97d00d523c1706/" alt="captcha" class="captcha" />-->
                       <!--</div>-->
                        <!--<div class="clearfix">-->
                            <!--<div class="form-group marb8 verify-code">-->
                                <!--<label>短信验证码</label>-->
                                <!--<input id="jsPhoneRegCaptcha" name="mobile_code" type="text" placeholder="输入手机验证码" />-->
                            <!--</div>-->
                            <!--<input class="verify-code-btn sendcode" id="jsSendCode" value="发送验证码">-->
                        <!--</div>-->
                        <!--<div class="form-group marb8">-->
                            <!--<label>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码</label>-->
                            <!--<input id="jsPhoneRegPwd" name="password_m" type="password" placeholder="请输入6-20位非中文字符密码" />-->
                        <!--</div>-->
                        <!--<div class="error btns" id="jsMobileTips"></div>-->
                        <!--<div class="auto-box marb8">-->

                        <!--</div>-->
                        <!--<input class="btn btn-green" id="jsMobileRegBtn" type="button" value="注册并登录" />-->
                    <!--</form>-->
                <!--</div>-->
                <div class="tab-form">
                    <form id="email_register_form" method="post" action="{% url 'register' %}" autocomplete="off">
                        <div class="form-group marb20 {% if register_form.email.errors %} errorput{% endif %}">
                            <label>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱</label>
                            <input  type="text" id="id_email" name="email" value="{% ifnotequal None register_form.email.value %}{{ register_form.email.value }}{% endifnotequal %}" placeholder="请输入您的邮箱地址" />
                        </div>
                        <div class="form-group marb8 {% if register_form.password.errors %} errorput{% endif %}">
                            <label>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码</label>
                            <input type="password" id="id_password" name="password"  value="{% ifnotequal None register_form.password.value %}{{ register_form.password.value }}{% endifnotequal %}" placeholder="请输入6-20位非中文字符密码" />
                        </div>
                        <div class="form-group marb8 captcha1 {% if register_form.captcha.errors %} errorput{% endif %}">
                            <label>验&nbsp;证&nbsp;码</label>
                           {{ register_form.captcha }}
                            {{ active_form.captcha }}
                        </div>
                        <div class="error btns" id="jsEmailTips">{% for key, error in register_form.errors.items %}{{ error }}{% endfor %}{{ msg }}</div>
                        <div class="auto-box marb8">
                        </div>
                        <input class="btn btn-green" id="jsEmailRegBtn" type="submit" value="注册并登录" />
                        {% csrf_token %}
                    </form>
                </div>
                <p class="form-p">已有账号？<a href="{% url 'login' %}">[立即登录]</a></p>
            </div>
        </div>
    </div>
</section>

<input id="isLogin" type="hidden" value="False"/>
<script src="{% static 'js/jquery.min.js' %}" type="text/javascript"></script>
<script src="{% static 'js/unslider.js' %}" type="text/javascript"></script>
<script src="{% static 'js/validateDialog.js' %}"  type="text/javascript"></script>
<script src="{% static 'js/login.js' %}"  type="text/javascript"></script>
</body>
</html>